<template>
	<div class="my">
		<div class="my-box">
			<div class="my-bg">
				
			</div>
			<div class="my-ic">
				<img src="@/assets/qyx.jpg" alt="">
			</div>
			<div class="my-name">
				{{myName}}
			</div>
		</div>
	</div>
</template>
<script>
	export default{
		data(){
			return {
				myName:'苟活不如不活'
			}
		}
	}
</script>
<style scoped lang="stylus">
	.my{

	}
	.my-bg{
		position: absolute;
		left: 0;
		top: 0;
		z-index: -1;
		width: 100%;
	    height: 4rem;
		background-image: url('http://tb.himg.baidu.com/sys/portrait/item/5bad0c0e?t=1521821257');
		background-size: 100% 100%;
		background-repeat: no-repeat;
		filter: blur(10px);
	}
	.my-ic{
		width: 2rem
		height:2rem;
		margin: 0 auto;
	}
	.my-ic img{
		width: 100%;
		height: 100%;
		margin-top: 1rem
		border-radius: 50%;
	}
	.my-name{
		margin-top: 1.3rem;
		text-align: center;
		font-size: .32rem;
		font-weight: bold;
		color: #fff;
	}
</style>